<!DOCTYPE html>
<html>
<head>
<title>index.html</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<link rel="stylesheet"
	href="/arcgis_js_api/library/3.12/3.12/dijit/themes/claro/claro.css">
<link rel="stylesheet"
	href="/arcgis_js_api/library/3.12/3.12/esri/css/esri.css">
	
<link rel="stylesheet" href="js/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-datetimepicker.css">
<link type="text/css" href="js/jquery-ui-bootstrap3/css/jquery-ui-1.10.0.custom.css" rel="stylesheet" />
<link type="text/css" href="js/ion.rangeSlider-2.0.6/css/normalize.css" rel="stylesheet" />
<link type="text/css" href="js/ion.rangeSlider-2.0.6/css/ion.rangeSlider.css" rel="stylesheet" />
<link type="text/css" href="js/ion.rangeSlider-2.0.6/css/ion.rangeSlider.skinModern.css" rel="stylesheet" />
<link type="text/css" href="css/tabdrop.css" rel="stylesheet" />
<link type="text/css" href="css/index.css" rel="stylesheet" />
<link href="js/bootstrap-touchspin/css/jquery.bootstrap-touchspin.css" rel="stylesheet" type="text/css" media="all">

<!-- <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>-->
<script src='js/jquery-1.11.0.min.js'></script>
<script src='js/bootstrap/js/bootstrap.min.js'></script>
<script src='js/bootstrap-datetimepicker.js'></script>
<script src='js/bootstrap-datetimepicker.zh-CN.js'></script>
<script src="js/highcharts/highcharts.js"></script>
<script src="js/highcharts/modules/exporting.js"></script>
<script src="js/bootstrap-touchspin/jquery.bootstrap-touchspin.js"></script>
<script src="js/bootstrap-touchspin/jquery.bootstrap-touchspin.min.js"></script>

<script src="js/jquery-dateFormat.min.js"></script>
<script src="js/bootbox.min.js"></script>
<script src="js/bootstrap-tabdrop.js"></script>

<script src="/arcgis_js_api/library/3.12/3.12/init.js"></script>


<!-- 自定义函数 -->
<script src="js/myjs/map/tiandi.js"></script>
<script src="main.js"></script>
<script src="js/myjs/common.js"></script>
<script src="js/myjs/rain.js"></script>
<script src="js/myjs/river_popup.js"></script>
<script src="js/myjs/rain_popup.js"></script>
<script src="js/myjs/evaporation_popup.js"></script>
<script src="js/myjs/reservoir_popup.js"></script>
<script src="js/myjs/weirgates_popup.js"></script>
<script src="js/myjs/pump_popup.js"></script>
<script src="js/myjs/tide_popup.js"></script>
<script src="js/myjs/groundWater_popup.js"></script>
<script src="js/myjs/moisture_popup.js"></script>
<script src="js/myjs/water.js"></script>
<script src="js/myjs/evaporation.js"></script>
<script src="js/myjs/groundWater.js"></script>
<script src="js/myjs/moisture.js"></script>

</head>
<body>
	<div id="map" style='height:100%' class="roundedCorners"
		data-dojo-type="dijit/layout/ContentPane"
		data-dojo-props="region:'center'"></div>
	<div class="BasemapToggle" id="BasemapToggle" style="display: block;position: absolute;top: 20px;left: 20px;z-index: 50;width: 72px;height: 86px;">
		<div id="basemapContainer" class="basemapContainer" style="height: 86px;">
			<div data-dojo-attach-point="_toggleNode" role="button" data-dojo-attach-event="ondijitclick:toggle" class="toggleButton satellite" title="切换底图" style="background:#fff;border:2px solid #666;width: 72px;height: 86px;padding: 4px;border-radius:5px;">
				<div calss="basemapImage" style="width: 60px;height: 60px;overflow: hidden;-webkit-user-select:none;">
					<img id="mapImg" alt="卫星影像" src="http://js.arcgis.com/3.7/js/esri/dijit/images/basemaps/satellite.jpg">
				</div>
				<div id="basemapTitle" class="basemapTitle" style="width: 100%;position: relative;">卫星影像</div>
			</div>
		</div>
	</div>
	<div id="sqLegend" class="toolbarYq" style="position: fixed;width: 200px; height: 180px; left: -1px; bottom: 0px;">
		<div class='form-group' id='rainfallStatistics'style='max-height:150px;overflow: auto;'>
			<table  style='position: fixed;bottom: 0px;left: 0px;width: 200px;' class="table table-bordered panel-table">
				<thead>
					<tr>
						<th>图例</th>
						<th>量级</th>
						<th>站点数</th>
						<th><input type="checkbox" id="rainAll" value='rainAll' checked></th>
					</tr>
				</thead>
				<tbody id="tbGradeTbody"></tbody>
			</table>
		</div>
		<div id="btnsqsl" class="btnsqsl" style="bottom:0px;position: fixed;">
	        <img id="imgSS" src="images/zk_ntn.png" style="display: inline;">
	        <img id="imgZK" src="images/ss_btn.png" style="display: none;">
	    </div>
	</div>
	<div class="panel panel-default" style='position: fixed;top: 20px;right: 10px;width: 300px;max-height:700px'>
	<div class="panel-body" style='padding: 10px 5px;'>
		<ul class="nav nav-tabs" role="tablist" id="panelTabs" >
			<li role="presentation" class="active"><a href="#rain" aria-controls="rain" role="tab" data-toggle="tab">雨情</a></li>
			<li role="presentation"><a href="#water" aria-controls="water" role="tab" data-toggle="tab">水情</a></li>
			<li role="presentation"><a href="#groundWater" aria-controls="groundWater" role="tab" data-toggle="tab">地下水</a></li>
			<li role="presentation"><a href="#moisture" aria-controls="moisture" role="tab" data-toggle="tab">墒情</a></li>
		</ul>
		<div class="tab-content">
			<div role="tabpanel" class="tab-pane active" id="rain">
				<ul class="nav nav-tabs nav-tabs-xs" role="tablist" id="rainPanelTabs" >
					<li role="presentation" class="active"><a href="#downRain" aria-controls="downRain" role="tab" data-toggle="tab">降水</a></li>
					<li role="presentation"><a href="#evaporation" aria-controls="evaporation" role="tab" data-toggle="tab">蒸发</a></li>
				</ul>
				<div class="tab-content">
					<div role="tabpanel" class="tab-pane active" id="downRain">
						<form class="form-inline">
						 <div class="form-group">
							<label class='radio-inline'>
							<input type="radio" name="dayRadio" id="nowDay" value="nowDay">今天
							</label>
							<label class='radio-inline'>
							<input type="radio" name="dayRadio" id="yestDay" value="yestDay" checked>昨天
							</label>
							<!-- <label class='radio-inline'>
							<input type="radio" name="dayRadio" id="lastThreeDay" value="lastThreeDay">最近三天
							</label> -->
							<label class='radio-inline'>
							<input type="radio" name="dayRadio" id="freeDate" value="freeDate">自定义日期
							</label>
						</div>
						<div class='form-group rain-panel-date' style='display:none;'>
							<div class='col-md-5'>
								<div class='input-group date form_date' data-date-format='yyyy-mm-dd' data-link-field='startTimeInput'>
									<input class='form-control' name='startTime' type='text' /><span
										class='input-group-addon'><span class="glyphicon glyphicon-calendar"></span></span>
								</div>
							</div>
							<div class="col-md-3 rainStartHour" style="padding-right: 15px;width: 50px;">
								<input id="rainStartHour" type="text" value="" name="rainStartHour" style="height:23px; width:30px;">
							</div>
							<div class='col-md-5'>
								<div class='input-group date form_date' data-date-format='yyyy-mm-dd' data-link-field='endTimeInput'>
									<input class='form-control' name='endTime' type='text' /><span
										class='input-group-addon'><span class="glyphicon glyphicon-calendar"></span></span>
								</div>
							</div>
							<div class="col-md-3 rainEndHour" style="padding-right: 15px;width: 50px;">
								<input id="rainEndHour" type="text" value="" name="rainEndHour" style="height:23px; width:30px;">
							</div>
							<div class='col-md-2 btn-group-xs'>
								<button id='queryRainBtn' type="button" class="btn btn-default">查询</button>
							</div>
						</div>
						<div class='form-group' id='layerRainTabsGroup' style='display:none;'>
						</div>
						<!-- <div class='form-group' id='rainSliderArea'>
						</div> -->
						<div class='form-group'>
							<label class="checkbox-inline inProvOrInCity">
								<input type="checkbox" id="outSide" value="outSide">
							</label>
							<label class="checkbox-inline smallReservoir " style="margin-left: 0px;">
								<input type="checkbox" id="smallReservoir" value="smallReservoir">小水库
							</label>
							<input type="text" style='width:100px' class="form-control input-sm" id="searchRainStatInput" placeholder="站码">
							<input class="btn btn-default btn-sm" type="button" id='searchRainStatBtn' value="检索" style="width:35px;padding-left: 5px; padding-right: 5px;">
							<input class="btn btn-default btn-sm panel-export" type="button" id='exportRainDataBtn' value="导出" style="width:35px;padding-left: 5px; padding-right: 5px;">
						</div>
						<div class='form-group' style='max-height:150px;overflow: auto;'>
							<table id='rainDataTable' class="table table-bordered panel-table">
								<thead>
									<tr>
										<th>序号</th>
										<th>站名</th>
										<th>数值</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>
						<div class='form-group'>
							<button type="button" id='drawVisionBtn' class="btn btn-primary btn-xs btn-block">绘制等值线</button>
						</div>
						</form>
					</div>
					<div role="tabpanel" class="tab-pane" id="evaporation">
						<form class="form-inline">
							<div class='form-group evaporation-panel-date'>
							<div class='col-md-6' style="padding-right: 15px;">
								<div class='input-group date form_date' data-date-format='yyyy-mm-dd' data-link-field='dayTimeInput'>
									<input class='form-control' size='' name='dayTime' type='text' style="height:30px;"/><span
										class='input-group-addon'><span class="glyphicon glyphicon-calendar"></span></span>
								</div>
							</div>
							<div class="col-md-3" style="padding-right: 10px;">
						<input id="hourTime_vertical" type="text" value="" name="hourTime_vertical" style="height:30px;">
						</div>
							<div class='col-md-2 btn-group-xs' style="padding-left: 10px;">
								<button id='queryEvaporationBtn' type="button" class="btn btn-default" style="height:30px;width:50px">查询</button>
							</div>
						</div>
						<div class='form-group'>
							<label class="checkbox-inline inProvOrInCity">
								<input type="checkbox" id="outSideEvaporation" value="outSideEvaporation">
							</label>
							<input type="text" style='width:140px' class="form-control input-sm" id="searchEvaporationStatInput" placeholder="站码">
							<input class="btn btn-default btn-sm" type="button" id='searchEvaporationStatBtn' value="检索">
							<input class="btn btn-default btn-sm panel-export" type="button" id='exportEvaporationDataBtn' value="导出">
						</div>
						<div class='form-group' style='max-height:150px;overflow: auto;'>
							<table id='evaporationDataTable' class="table table-bordered panel-table">
								<thead>
									<tr>
										<th>序号</th>
										<th>站名</th>
										<th>数值</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>
						</form>
					</div>
				</div>
			</div>
			<div role="tabpanel" class="tab-pane" id="water">
				<form class="form-inline">
				 <div class='form-group water-panel-date'>
					<div class='col-md-6' style="padding-right: 20px;">
						<div class='input-group date form_date' data-date-format='yyyy-mm-dd' data-link-field='dayTimeInput'>
							<input class='form-control' name='dayTimeWater' type='text' style="height:30px;"/><span
								class='input-group-addon'><span class="glyphicon glyphicon-calendar"></span></span>
						</div>
					</div>
					<div class="col-md-3" style="padding-right: 10px;">
				<input id="hourTimeWater_vertical" type="text" value="" name="hourTimeWater_vertical" style="height:30px;">
				</div>
					<div class='col-md-2 btn-group-xs' style="padding-left: 10px;">
						<button id='queryWaterBtn' type="button" class="btn btn-default" style="height:30px;width:50px">查询</button>
					</div>
				</div>
				 <div class="form-group" id='waterTypeChk'>
				 	<label class="checkbox-inline">
						<input type="checkbox" id="hedaoBox" value='ZZ' checked> 河道
					</label>
					<label class="checkbox-inline">
						<input type="checkbox" id="shuikuBox" value='RR' checked> 水库
					</label>
					<label class="checkbox-inline">
						<input type="checkbox" id="yanzhaBox" value='DD'> 堰闸
					</label>
					<label class="checkbox-inline">
						<input type="checkbox" id="bengzhanBox" value='DP'> 泵站
					</label>
					<label class="checkbox-inline">
						<input type="checkbox" id="chaoweiBox" value='TT'> 潮位
					</label>
				 </div>
				 <div class="form-group" style='border: 1px solid rgb(0, 0, 0); display: inline-block'>
				 	<label class="checkbox-inline">
						<input type="checkbox" id="bigOneBox" value='BO' checked>大一
					</label>
					<label class="checkbox-inline" style='padding-left: 10px'>
						<input type="checkbox" id="bigTwoBox" value='BT' checked>大二
					</label>
					<label class="checkbox-inline" style='padding-left: 10px'>
						<input type="checkbox" id="middleSizeBox" value='MS' checked>中型
					</label>
					<label class="checkbox-inline" style='padding-left: 10px'>
						<input type="checkbox" id="samllOneBox" value='SO'>小一
					</label>
					<label class="checkbox-inline" style='padding-left: 10px'>
						<input type="checkbox" id="smallTwoBox" value='ST'>小二
					</label>
					<label class="checkbox-inline" style='padding-left: 10px'>
						<input type="checkbox" id="otherSizeBox" value='OZ'>其它
					</label>
				 </div>
				 <div class="form-group">
				 	<label class="checkbox-inline inProvOrInCity ">
				 		<input type="checkbox" id="outSlideWater">
				 	</label>
					<input type="text" style='width:140px' class="form-control input-sm" id="searchWaterStatInput" placeholder="站码">
					<input class="btn btn-default btn-sm" type="button" id='searchWaterStatBtn' value="检索">
					<input class="btn btn-default btn-sm panel-export" type="button" id='exportWaterDataBtn' value="导出">
				 </div>
				 <div class='form-group' style='max-height:150px;overflow: auto;'>
					<table id='waterDataTable' class="table table-bordered panel-table">
						<thead>
							<tr>
								<th>序号</th>
								<th>站名</th>
								<th>数值</th>
								<th>预警等级</th>
							</tr>
						</thead>
						<tbody></tbody>
					</table>
				</div>
				</form>
				
			</div>
			<div role="tabpanel" class="tab-pane" id="groundWater">
				<form class="form-inline">
					<div class='form-group groundWater-panel-date'>
					<div class='col-md-6' style="padding-right: 15px;">
						<div class='input-group date form_date' data-date-format='yyyy-mm-dd' data-link-field='dayTimeInput'>
							<input class='form-control' size='' name='dayTimeGroundWater' type='text' style="height:30px;"/><span
								class='input-group-addon'><span class="glyphicon glyphicon-calendar"></span></span>
						</div>
					</div>
					<div class="col-md-3" style="padding-right: 10px;">
				<input id="demo_vertical" type="text" value="" name="demo_vertical" style="height:30px;">
				</div>
					<div class='col-md-2 btn-group-xs' style="padding-left: 10px;">
						<button id='queryGroundWaterBtn' type="button" class="btn btn-default" style="height:30px;width:50px">查询</button>
					</div>
				</div>
				<div class='form-group'>
					<label class="checkbox-inline inProvOrInCity">
						<input type="checkbox" id="outSideGroundWater" value="outSideGroundWater">
					</label>
					<input type="text" style='width:140px' class="form-control input-sm" id="searchGroundWaterStatInput" placeholder="站码">
					<input class="btn btn-default btn-sm" type="button" id='searchGroundWaterStatBtn' value="检索">
					<input class="btn btn-default btn-sm panel-export" type="button" id='exportGroundWaterDataBtn' value="导出">
				</div>
				<div class='form-group' style='max-height:150px;overflow: auto;'>
					<table id='groundWaterDataTable' class="table table-bordered panel-table">
						<thead>
							<tr>
								<th>序号</th>
								<th>站名</th>
								<th>数值</th>
							</tr>
						</thead>
						<tbody></tbody>
					</table>
				</div>
				</form>
			</div>
			<div role="tabpanel" class="tab-pane" id="moisture">
				<form class="form-inline">
					<div class='form-group moisture-panel-date'>
					<div class='col-md-5' style="padding-right: 5px;">
						<div class='input-group date form_date' data-date-format='yyyy-mm-dd' data-link-field='dayTimeInput'>
							<input class='form-control' size='' name='dayTimeMoisture' type='text' style="height: 30px;"/><span
								class='input-group-addon'><span class="glyphicon glyphicon-calendar"></span></span>
						</div>
					</div>
					<div class="col-md-3" style="padding-right: 15px;width: 50px;">
				<input id="moistureHour" type="text" value="" name="moistureHour" style="height:30px; width:30px;">
				</div>
				<div class="col-md-2" style="width:60px;padding-left: 5px;">
				<select id="paramSelect" class="form-control" style="height:30px; width:55px;">
						<option>0</option>
						<option>10</option>
						<option selected="selected">20</option>
						<option>30</option>
						<option>40</option>
						<option>60</option>
						<option>80</option>
						<option>100</option>
						<option>110</option>
						</select>
				</div>
					<div class='col-md-2 btn-group-xs' style="padding-left: 15px;">
						<button id='queryMoistureBtn' type="button" class="btn btn-default" style="height: 30px;width:45px;">查询</button>
					</div>
				</div>
				<div class='form-group'>
					<label class="checkbox-inline inProvOrInCity">
						<input type="checkbox" id="outSideMoisture" value="outSideMoisture">
					</label>
					<input type="text" style='width:140px' class="form-control input-sm" id="searchMoistureStatInput" placeholder="站码">
					<input class="btn btn-default btn-sm" type="button" id='searchMoistureStatBtn' value="检索">
					<input class="btn btn-default btn-sm panel-export" type="button" id='exportMoistureDataBtn' value="导出">
				</div>
				<div class='form-group' style='max-height:150px;overflow: auto;'>
					<table id='moistureDataTable' class="table table-bordered panel-table">
						<thead>
							<tr>
								<th>序号</th>
								<th>站名</th>
								<th>数值</th>
							</tr>
						</thead>
						<tbody></tbody>
					</table>
				</div>
				</form>
			</div>
		</div>
	</div>
	</div>
	<div id='drawVision' style='display:none'>
		<form class="form-inline">
			<!-- <div class="form-group">
				<label class="control-label">线条来源：</label>
				<label class="radio-inline">
					<input id="autoSet" type="radio" name='dataForm' value='autoSet'> 自动计算
				</label>
				<label class="radio-inline">
					<input id="selfSet" type="radio" name='dataForm' value='selfSet'> 人工定义
				</label>
			</div> -->
			<div class="form-group" id="lineNums">
				<label class="control-label">线条数值：</label>
				<input type="text" class="form-control input-sm" id="lineNumVal" style="position: absolute;width:165px">
				<select id="lineNumSelect" class="form-control" style="height:30px; width:180px;">
					<option selected="selected">A:10,25,50,100,150,200</option>
					<option>B:10,25,50,100,200,300</option>
					<option>C:50,100,200,300,400,500,600</option>
					<option>D:100,200,300,400,500,600,700</option>
					<option>E:100,200,300,400,500,600,700</option>
				</select>
			</div>
			<!-- <div class="form-group">
				<label class="control-label">线条数值：</label>
				<input type="text" class="form-control input-sm" id="lineNum" placeholder="10 25 50 100 200">
			</div> -->
			<div class="form-group">
				<label class="control-label">绘制类型：</label>
				<label class="radio-inline">
					<input type="radio" name="drawType" value='visoline' checked> 等值线
				</label>
				
				<label class="radio-inline">
					<input type="radio" name="drawType" value='visoface' > 等值面
				</label>
			</div>
			<div class="form-group">
				<label class="control-label">数据类型：</label>
				<select id="dataType" class="form-control" style="height:30px; width:180px;">
					<option value="allStat" selected="selected">全&nbsp;省&nbsp;雨&nbsp;量&nbsp;站&nbsp;点</option>
					<option value="100Stat" >雨&nbsp;量&nbsp;100&nbsp;站&nbsp;点</option>
					<option value="150Stat" >雨&nbsp;量&nbsp;150&nbsp;站&nbsp;点</option>
					<option value="188Stat" >雨&nbsp;量&nbsp;188&nbsp;站&nbsp;点</option>
					<option value="280Stat" >雨&nbsp;量&nbsp;280&nbsp;站&nbsp;点</option>
				</select>
			</div>
			<div class="form-group">
				<label class="checkbox-inline" style='height:20px;padding-left:130px;padding-top:3px;'>
					<input type="checkbox" id="visoLineShow" value=' '>等值线
				</label>
				<label class="checkbox-inline" style='height:20px;position:absolute;padding-top:3px;padding-right: 10px;'>
					<input type="checkbox" id="stcdShow" value=' '>站点
				</label>
				<div class='pull-right'>
					<button id="visionBtn" type="button" class="btn btn-primary btn-xs">绘制</button>
					<!-- <button id="showBtn" type="button" class="btn btn-primary btn-xs">显示</button>
					<button id="hideBtn" type="button" class="btn btn-primary btn-xs">隐藏</button
					<button id="clearBtn" type="button" class="btn btn-primary btn-xs">清除</button> -->
				</div>
			</div>
		</form>
	</div>
		
	<div id='exportGridForm'></div>	
	<div id='windowContent' class='dialogWindow'>
		<button type="button" id='rsvrfcchReservoir' class="btn btn-default btn-xs reservoir" style='position: absolute;top: 6px; z-index:10'>防洪指标</button>
		<button type="button" id='rsvrfcchRiver' class="btn btn-default btn-xs river" style='position: absolute;top: 6px; z-index:10'>防洪指标</button>
		<button type="button" id='baseInfo' class="btn btn-default btn-xs rain river weirgates reservoir pump evaporation groundWater moisture tide" style='position: absolute;top: 6px; z-index:10'>基本信息</button>
		<button type="button" id='exportCsvBtn' class="btn btn-default btn-xs rain river weirgates reservoir pump evaporation groundWater moisture tide layerRain" style='width:60px;position: absolute;right: 13px;top: 382px; z-index:10;'>导出</button>
		<ul class="nav nav-tabs" role="tablist" id="winTabs" >
			<li role="presentation"><a href="#day" aria-controls="day" role="tab" data-toggle="tab"></a></li>
			<li role="presentation"><a href="#hour" aria-controls="hour" role="tab" data-toggle="tab"></a></li>
		</ul>

		<div class="tab-content">
		<div role="tabpanel" class="tab-pane" id="day">
			<div class='params' class='form-group row' style='margin: 5px 0px;height: 40px;'>
			<form class="form-inline">
				<div class='col-md-5'>
					<label for='startTimeInput'
						class='col-md-6 control-label'>开始日期：</label>
					<div class='input-group date form_date col-md-6'
						data-date-format='yyyy-mm-dd' data-link-field='startTimeInput'>
						<input class='form-control' name='startTime' type='text' /><span
							class='input-group-addon'><span
							class='glyphicon glyphicon-th'></span></span>
					</div>
				</div>
				<div class='col-md-5'>
					<label for='endTimeInput'
						class='col-md-6 control-label'>结束日期：</label>
					<div class='input-group date form_date col-md-6'
						data-date-format='yyyy-mm-dd' data-link-field='endTimeInput'>
						<input class='form-control' name='endTime' type='text' /><span
							class='input-group-addon'><span
							class='glyphicon glyphicon-th'></span></span>
					</div>
				</div>
				<div class='col-md-3 dxnClass' style='width: 140px;'>
					<label class='control-label'>典型年：</label>
					<select id="dxn" name="dxn" class="form-control input-sm" style='width: 55px;padding: 0;'>
						<option>2010</option>
						<option>2009</option>
						<option>2008</option>
						<option>2007</option>
						<option>2006</option>
						<option>2005</option>
						<option>2004</option>
						<option>2003</option>
						<option>2002</option>
						<option>2001</option>
						<option>2000</option>
						<option>1999</option>
					</select>
				</div>
				<div class='col-md-3 kzClass' style="width: 140px;">
					<label class='control-label'>扩展：</label>
					<select id="exKey" name="exKey" class="form-control input-sm" style='width: 55px;padding: 0;'>
						<option>@</option>
						<option>A</option>
						<option>B</option>
						<option>C</option>
						<option>D</option>
						<option>E</option>
						<option>F</option>
						<option>G</option>
						<option>H</option>
						<option>I</option>
						<option>J</option>
						<option>K</option>
					</select>
				</div>
				<div class='col-md-1'>
					<button type="button" id='windowQuery' class="btn btn-default input-sm">查询</button>
				</div>
			</form>
			</div>
			<div id='chart' style='width:750px;height:300px'></div>
			<div class='dataPanel'>
				<ul class="nav nav-tabs" role="tablist" id="gridDayTabs" >
					<li role="presentation" class="rain river weirgates reservoir pump tide"><a href="#featureAnalysisDay" aria-controls="featureAnalysisDay" role="tab" data-toggle="tab">特征分析</a></li>
					<li role="presentation" class='river weirgates reservoir pump tide'><a href="#warnDay" aria-controls="warnDay" role="tab" data-toggle="tab">超警天数</a></li>
					<li role="presentation" class='rain river weirgates reservoir pump evaporation groundWater moisture tide haveExport'><a href="#featureDataDay" aria-controls="featureDataDay" role="tab" data-toggle="tab">数据列表</a></li>
				</ul>

				<div class="tab-content">
					<div role="tabpanel" class="tab-pane" id="featureAnalysisDay">
						<table class='table table-bordered rain'>
							<thead>
								<tr>
									<th rowspan='2'>项目</th>
									<th colspan='2'>最大1天</th>
									<th colspan='2'>最大3天</th>
									<th colspan='2'>最大7天</th>
									<th colspan='2'>最大15天</th>
									<th colspan='2'>最大30天</th>
								</tr>
								<tr>									
									<th>雨量</th>
									<th>起始日期</th>									
									<th>雨量</th>
									<th>起始日期</th>								
									<th>雨量</th>
									<th>起始日期</th>									
									<th>雨量</th>
									<th>起始日期</th>									
									<th>雨量</th>
									<th>起始日期</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>当前</td>
								</tr>
								<tr>
									<td>历史</td>
								</tr>
								<tr>
									<td>排位</td>
								</tr>
							</tbody>
						</table>
						<table class='table table-bordered river'>
							<thead>
								<tr>
									<th rowspan='2'>项目</th>
									<th colspan='2'>最高水位</th>
									<th colspan='2'>最低水位</th>
									<th rowspan='2'>平均水位</th>
									<th colspan='2'>最大流量</th>
									<th colspan='2'>最小流量</th>
									<th rowspan='2'>平均流量</th>
								</tr>
								<tr>
									<th>水位</th>
									<th>日期</th>
									<th>水位</th>
									<th>日期</th>
									<th>流量</th>
									<th>日期</th>
									<th>流量</th>
									<th>日期</th>	
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>当前</td>
								</tr>
								<tr>
									<td>历史</td>
								</tr>
								<tr>
									<td>排位</td>
								</tr>
							</tbody>
						</table>
						<table class='table table-bordered reservoir'>
  							<thead>
  								<tr>
  									<th rowspan='2'>项目</th>
  									<th colspan='2'>最高水位</th>
  									<th colspan='2'>最低水位</th>
  									<th rowspan='2'>平均水位</th>
  								</tr>
  								<tr>		  							
  									<th>水位</th>
  									<th>日期</th>
  									<th>水位</th>
  									<th>日期</th>
  								</tr>
  							</thead>
  							<tbody>
  								<tr>
  									<td>当前</td>
  								</tr>
  								<tr>
  									<td>历史</td>
  								</tr>
  								<tr>
  									<td>排位</td>
  								</tr>
  							</tbody>
  						</table>
						<table class='table table-bordered weirgates'>
							<thead>
								<tr>
									<th rowspan='2'>项目</th>
									<th colspan='2'>最高水位</th>
									<th colspan='2'>最低水位</th>
									<th rowspan='2'>平均水位</th>
									<th colspan='2'>最大流量</th>
									<th colspan='2'>最小流量</th>
									<th rowspan='2'>平均流量</th>
								</tr>
								<tr>
									<th>水位</th>
									<th>日期</th>
									<th>水位</th>
									<th>日期</th>
									<th>流量</th>
									<th>日期</th>
									<th>流量</th>
									<th>日期</th> 
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>当前</td>
								</tr>
								<tr>
									<td>历史</td>
								</tr>
								<tr>
									<td>排位</td>
								</tr>
							</tbody>
						</table>
						<table class='table table-bordered pump'>
                    		<thead>
                        		<tr>
                            		<th rowspan='2'>项目</th>
                            		<th colspan='2'>最高水位</th>
                            		<th colspan='2'>最低水位</th>
                            		<th rowspan='2'>平均水位</th>
                            		<th colspan='2'>最大流量</th>
                            		<th colspan='2'>最小流量</th>
                            		<th rowspan='2'>平均流量</th>
                        		</tr>
                        		<tr>                                    
                            		<th>水位</th>
                            		<th>日期</th>
                            		<th>水位</th>
                            		<th>日期</th>
                            		<th>流量</th>
                            		<th>日期</th>
                            		<th>流量</th>
                            		<th>日期</th>                             
                        		</tr>
                    		</thead>
                    		<tbody>
                        		<tr>
                            		<td>当前</td>
                        		</tr>
                        		<tr>
                            		<td>历史</td>
                        		</tr>
                        		<tr>
                            		<td>排位</td>
                        		</tr>
                    		</tbody>
                		</table>
                		<table class='table table-bordered tide'>
                    		<thead>
                        		<tr>
                            		<th rowspan='2'>项目</th>
                            		<th colspan='2'>最高水位</th>
                            		<th colspan='2'>最低水位</th>
                        		</tr>
                        		<tr>                                    
                            		<th>水位</th>
                            		<th>日期</th>
                            		<th>水位</th>
                            		<th>日期</th>
                        		</tr>
                    		</thead>
                    		<tbody>
                        		<tr>
                            		<td>当前</td>
                        		</tr>
                        		<tr>
                            		<td>历史</td>
                        		</tr>
                        		<tr>
                            		<td>排位</td>
                        		</tr>
                    		</tbody>
                		</table>
					</div>
					<div role="tabpanel" class="tab-pane" id="warnDay">
						<label id="warnDayLabel" class='river weirgates reservoir pump tide'></label>
					</div>
					<div role="tabpanel" class="tab-pane" id="featureDataDay">
						<div class='table-responsive pre-scrollable rain' style='max-height:95px'>
							<table class='table table-bordered table-hover'>
								<thead>
									<tr>
										<th>日期</th>
										<th>降雨量(mm)</th>
										<th>累计降雨量(mm)</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>
						<div class='table-responsive pre-scrollable river' style='max-height:95px'>
							<table class='table table-bordered table-hover'>
								<thead>
									<tr>
										<th>日期</th>
										<th>水位(m)</th>
										<th>多年同期水位(m)</th>
										<th>典型年水位(m)</th>
										<th>流量(m³/s)</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>
						<div class='table-responsive pre-scrollable reservoir' style='max-height:95px'>
  							<table class='table table-bordered table-hover'>
  								<thead>
  									<tr>
  										<th data-field="tm">日期</th>
  										<th data-field="val">水位(m)</th>
  										<th data-field="value1">多年同期水位(m)</th>
  										<th data-field="value6">典型年水位(m)</th>
  										<th data-field="value5">流量(m³/s)</th>
  									</tr>
  								</thead>
            					<tbody></tbody>
  							</table>
        				</div>
        				<div class='table-responsive pre-scrollable pump' style='max-height:95px'>
                			<table class='table table-bordered table-hover'>
                    			<thead>
                        			<tr>
                            			<th data-field="tm">日期</th>
                            			<th data-field="val">水位(m)</th>
                            			<th data-field="value1">多年同期水位(m)</th>
                            			<th data-field="value6">典型年水位(m)</th>
                            			<th data-field="value5">流量(m³/s)</th>
                        			</tr>
                    			</thead>
                    			<tbody></tbody>
                			</table>
        				</div>
        				<div class='table-responsive pre-scrollable evaporation' style='max-height:95px'>
                        	<table class='table table-bordered table-hover'>
                            	<thead>
                                	<tr>
                                    	<th>日期</th>
                                    	<th>蒸发量(mm)</th>
                                	</tr>
                            	</thead>
                            	<tbody></tbody>
                        	</table>
                    	</div>
                    	<div class='table-responsive pre-scrollable groundWater' style='max-height:95px'>
  							<table class='table table-bordered table-hover'>
  								<thead>
  									<tr>
  										<th>日期</th>
  										<th>水位(m)</th>
  									</tr>
  								</thead>
            					<tbody></tbody>
  							</table>
        				</div>
        				<div class='table-responsive pre-scrollable moisture' style='max-height:95px'>
  							<table class='table table-bordered table-hover'>
  								<thead>
  									<tr>
  										<th>日期</th>
  										<th>0cm含水率(%)</th>
  										<th>10cm含水率(%)</th>
  										<th>20cm含水率(%)</th>
  										<th>30cm含水率(%)</th>
  										<th>40cm含水率(%)</th>
  										<th>60cm含水率(%)</th>
  										<th>80cm含水率(%)</th>
  										<th>100cm含水率(%)</th>
  									</tr>
  								</thead>
            					<tbody></tbody>
  							</table>
        				</div>
        				<div class='table-responsive pre-scrollable tide' style='max-height:95px'>
                			<table class='table table-bordered table-hover'>
                    			<thead>
                        			<tr>
                            			<th data-field="tm">日期</th>
                            			<th data-field="val">潮位(m)</th>
                            			<th data-field="value1">多年同期水位(m)</th>
                            			<th data-field="value6">典型年水位(m)</th>
                        			</tr>
                    			</thead>
                    			<tbody></tbody>
                			</table>
        				</div>
        				<div class='table-responsive pre-scrollable weirgates' style='max-height:95px'>
				                <table class='table table-bordered table-hover'>
				                    <thead>
				                        <tr>
				                            <th data-field="tm">日期</th>
				                            <th data-field="val">水位(m)</th>
				                            <th data-field="value1">多年同期水位(m)</th>
				                            <th data-field="value6">典型年水位(m)</th>
				                            <th data-field="value5">流量(m³/s)</th>
				                        </tr>
				                    </thead>
				                    <tbody></tbody>
				                </table>
				        </div>
					</div>
				</div>
			</div>
		</div>
		<div role="tabpanel" class="tab-pane" id="hour">
			<div class='params' class='form-group row' style='margin: 5px 0px;height: 40px;'>
			<form class="form-inline">
				<div class='col-md-5'>
					<label for='startTimeInput'
						class='col-md-6 control-label'>开始日期：</label>
					<div class='input-group date form_date col-md-6'
						data-date-format='yyyy-mm-dd' data-link-field='startTimeInput'>
						<input class='form-control' name='startTime' type='text' /><span
							class='input-group-addon'><span
							class='glyphicon glyphicon-th'></span></span>
					</div>
				</div>
				<div class='col-md-5'>
					<label for='endTimeInput'
						class='col-md-6 control-label'>结束日期：</label>
					<div class='input-group date form_date col-md-6'
						data-date-format='yyyy-mm-dd' data-link-field='endTimeInput'>
						<input class='form-control' name='endTime' type='text' /><span
							class='input-group-addon'><span
							class='glyphicon glyphicon-th'></span></span>
					</div>
				</div>
				<div class='col-md-3 dxnClass' style='width: 140px;'>
					<label class='control-label'>典型年：</label>
					<select id="dxn" name="dxn" class="form-control input-sm" style='width: 55px;padding: 0;'>
						<option>2010</option>
						<option>2009</option>
						<option>2008</option>
						<option>2007</option>
						<option>2006</option>
						<option>2005</option>
						<option>2004</option>
						<option>2003</option>
						<option>2002</option>
						<option>2001</option>
						<option>2000</option>
						<option>1999</option>
					</select>
				</div>
				<div class='col-md-1'>
					<button type="button" id='windowQuery' class="btn btn-default input-sm">查询</button>
				</div>
			</form>
			</div>
			<div id='chart' style='width:750px;height:300px'></div>
			<div class='dataPanel'>
				<ul class="nav nav-tabs" role="tablist" id="gridHourTabs" >
					<li role="presentation" class="rain"><a href="#featureAnalysisHour" aria-controls="featureAnalysisHour" role="tab" data-toggle="tab">特征分析</a></li>				
					<li role="presentation" class='rain river reservoir pump tide weirgates haveExport'><a href="#featureDataHour" aria-controls="featureDataHour" role="tab" data-toggle="tab">数据列表</a></li>
				</ul>
				<div class="tab-content">
					<div role="tabpanel" class="tab-pane" id="featureAnalysisHour">
						<table class='table table-bordered rain'>
							<thead>
								<tr>
									<th rowspan='2'>项目</th>
									<th colspan='2'>最大1小时</th>
									<th colspan='2'>最大3小时</th>
									<th colspan='2'>最大6小时</th>
									<th colspan='2'>最大12小时</th>
									<th colspan='2'>最大24小时</th>
								</tr>
								<tr>
									<th>起始日期</th>
									<th>雨量</th>
									<th>起始日期</th>
									<th>雨量</th>
									<th>起始日期</th>
									<th>雨量</th>
									<th>起始日期</th>
									<th>雨量</th>
									<th>起始日期</th>
									<th>雨量</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>当前</td>
								</tr>
								<tr>
									<td>历史</td>
								</tr>
								<tr>
									<td>排位</td>
								</tr>
							</tbody>
						</table>
					</div>
					<div role="tabpanel" class="tab-pane" id="featureDataHour">
						<div class='table-responsive pre-scrollable rain' style='max-height:95px'>
							<table class='table table-bordered table-hover'>
								<thead>
									<tr>
										<th>日期</th>
										<th>降雨量(mm)</th>
										<th>累计降雨量(mm)</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>
						<div class='table-responsive pre-scrollable river' style='max-height:95px'>
							<table class='table table-bordered table-hover'>
								<thead>
									<tr>
										<th>日期</th>
										<th>水位(m)</th>
										<th>流量(m³/s)</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>
						<div class='table-responsive pre-scrollable reservoir' style='max-height:95px'>
  							<table class='table table-bordered table-hover'>
  								<thead>
  									<tr>
  										<th>日期</th>
  										<th>水位(m)</th>
  										<th>流量(m³/s)</th>
  									</tr>
  								</thead>
            					<tbody></tbody>
  							</table>
  						</div>
  						<div class='table-responsive pre-scrollable pump' style='max-height:95px'>
                			<table class='table table-bordered table-hover'>
                    			<thead>
                        			<tr>
                            			<th data-field="tm">日期</th>
                            			<th data-field="val">水位(m)</th>
                            			<th data-field="value2">流量(m³/s)</th>
                        			</tr>
                    			</thead>
            					<tbody></tbody>
                			</table>
            			</div>
            			<div class='table-responsive pre-scrollable tide' style='max-height:95px'>
                			<table class='table table-bordered table-hover'>
                    			<thead>
                        			<tr>
                            			<th data-field="tm">日期</th>
                            			<th data-field="val">潮位(m)</th>
                        			</tr>
                    			</thead>
            					<tbody></tbody>
                			</table>
            			</div>
            			<div class='table-responsive pre-scrollable weirgates' style='max-height:95px'>
			                <table class='table table-bordered table-hover'>
			                    <thead>
			                        <tr>
			                            <th data-field="tm">日期</th>
			                            <th data-field="val">水位(m)</th>
			                            <th data-field="value2">流量(m³/s)</th>
			                        </tr>
			                    </thead>
			            		<tbody></tbody>
			                </table>
			            </div>
					</div>
				</div>
			</div>
		</div>
		</div>
	</div>

	<div id="windowDialogInfo" style='display:none'>
		<table class="table table-bordered"></table>
	</div>

	<div id='plWindow' style='display:none'>
		<form class="form-inline">
			<div class="form-group pl-option" style='height: 35px;'>
				<div style='width: 290px;position: relative;top: 6px;'>
					<label class="control-label" style="cursor:pointer;color:red;" id='historyViewDatas'>历史序列</label>
					<label class="control-label" style="cursor:pointer;color:red;" id='sjzViewDatas'>设计值</label>
					<label class="control-label">计算数值：<span id='jszSpan'>0.0</span></label>
					<label class="control-label">重现期：<span id='cxzSpan'>0.0</span></label>
				</div>
				<div style='width: 420px;float: right;position: relative;top: -25px;'>
					<label>
						<input type="checkbox" id="plFreeSet" value="">
						自定义
					</label>
					<label class="control-label">Cv:</label>
					<div style='max-width: 100px;top: -12px;position: relative;' class='form-group'>
						<input type="text" id="cvSlider" name="example_name" value="" />
					</div>
					<label class="control-label">Cs:</label>
					<div style='max-width: 100px;top: -12px;position: relative;' class='form-group'>
						<input type="text" id="csSlider" name="example_name" value="" />
					</div>
					<div class='form-group' style='max-width:20px'>
						<button type="button" class="btn btn-default btn-xs" id='drawPl'>绘制</button>
					</div>
				</div>
			</div>
			<div class="form-group">
				<img src="plImg/pinlv.png" id='plImg'>
			</div>
		</form>
	</div>
	<div id='historyTable' style='display:none'>
		<table class='table table-bordered table-condensed table-hover table-striped'>
			<thead>
				<tr>
					<th>序号</th>
					<th>日期</th>
					<th>数值</th>
				</tr>
			</thead>
			<tbody></tbody>
		</table>
	</div>

</body>

<script src="js/jquery-ui-bootstrap3/js/jquery-ui-1.10.0.custom.min.js" type="text/javascript"></script>
<script src="js/ion.rangeSlider-2.0.6/ion.rangeSlider.min.js" type="text/javascript"></script>
</html>